<!-- TODO: replace the contents of this file with your own html -->
<div id="main-view">
    <div class="palm-body-text">
        <div id="scores">
            <div style="width:50%;text-align:center;margin-left:auto;margin-right:auto">
                <span class="label">Round:</span>
                <span id="qNumber" style="padding:0 0 0 10px">Round</span>
            </div>
        </div>
        <div class="palm-list">
            <div id="StaffContainer" class="palm-row">
                <div class="palm-row-wrapper" style="margin:auto;width:290px">
                    <canvas id="music" style="border: solid 1px;background-color:white;" width="290" height="300">
                    </canvas>
                    <audio id="noteSound1">
                    </audio>
					<audio id="noteSound2">
                    </audio>
                </div>
            </div>
            <div id="AudioContainer" class="palm-row" style="display:none">
                <div class="palm-row-wrapper">
                    <div style="height:100px">
                        &nbsp;
                    </div>
                    <div x-mojo-element="Button" id="AudioControl">
                        Play Again
                    </div>
                    <div style="height:100px">
                        &nbsp;
                    </div>
                </div>
            </div>
            <div class="palm-row last">
                <div class="palm-row-wrapper">
                    <div x-mojo-element="RadioButton" id="choiceButtons">
                        There
                    </div>
                </div>
            </div>
        </div>
    </div>
	<div id="debug"></div>
</div>
